<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>Layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../../src/css/layui.css">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
  <!-- <style>
    .layui-input,
    .layui-select,
    .layui-textarea {
        height: 30px !important;
    }

    .layui-table-header {
        background-color: #ebf1f0 !important;
    }

    .layui-btn-1 {
        height: 30px !important;
        line-height: 28px !important;
        font-size: 12px !important;
    }

    .layui-form-item .layui-form-checkbox {
        margin-top: 0px !important;
    }

    .layui-form-item {
        margin-bottom: 0px !important;
        height: 35px !important;
    }

    .layui-form-mid {
        padding: 5px 0 !important;
    }

    .layui-btn-xs {
        height: 18px !important;
        line-height: 18px !important;
    }

    .layui-table thead tr {
        background-color: aliceblue !important;
    }

    /*设置工具栏样式*/
    .layui-table-tool {
        position: absolute !important;
        z-index: 890;
        width: 60px;
        min-height: 40px;
        line-height: 30px;
        padding: 10px 15px;
        border-top-right-radius: 8px;
        border-top-left-radius: 8px;
        border: 1px solid #e6e6e6;
        background-color: aliceblue;
        right: 15px;
        top: 50px;
    }

    .layui-table-tool .layui-table-tool-self .layui-inline[lay-event] {
        margin: -10px 0 0 10px;
    }

    /*设置宽度*/
    .layui-form-item .layui-input-inline {
        width: 130px;
    }

</style> -->
</head>

<body>

  <div style="padding: 15px; ">
    <form class="layui-form" action="" lay-filter="example">

<!-- 
      <button type="submit" class="layui-btn" lay-submit="" lay-filter="search"
        style="float:right;margin-right: 50px;">查看结果</button> -->
      
        <table id="detail_table" lay-filter="detail_table"></table>
      </div>
    </form>

  </div>

  <script type="text/html" id="bar_list">

    <a class="layui-btn layui-btn-xs" lay-event="view">查看详情</a>

</script>

  <script src="../../src/layui.js" charset="utf-8"></script>
  <script src="....//src/setter.js?v=0513"></script>
  <script src="../../pages/js/jquery.min.js"></script>
  <script src="../../pages/js/echarts.min.js"></script>
  <script src="../../pages/js/theme/westeros.js"></script>
  <script src="../../pages/js/theme/macarons.js"></script>
  <script src="../../pages/js/theme/purple-passion.js"></script>
  <script src="../../pages/js/theme/dark.js"></script>
  <script>
    layui.use(['table', 'element', 'form', 'laydate', 'layer'], function () {
      var form = layui.form;
      var $ = layui.jquery;
      var layer = layui.layer;
      var table = layui.table;

    

      loadTable();
      
      //监听提交
      form.on('submit(search)', function (data) {

        loadTable();
        return false;
      });

      //加载表格
      function loadTable() {
        //第一个实例
        table.render({
          elem: '#detail_table'
          , height: 'full-50'
          , url: '../json/maintain/operation.json' //数据接口
          , page: true //开启分页
          // , size: 'sm'
          , cols: [[
            { type: 'numbers', title: '序号', width: 50 }
            , { field: 'name', title: '运营公司', width: 150, sort: true }
            , { field: 'line', title: '线路' }
          ]]
        });
      }

      

    });

  </script>

</body>

</html>